<template>
  <div>
    <!--  填写国内运单号弹窗  -->
    <el-dialog
      title="填写发货信息"
      :visible.sync="isOpen"
      width="800px"
      :before-close="close">
      <!--      <el-form label-width="120px">-->
      <!--        <el-form-item label="物流发货方式：" prop="sendOutMode">-->
      <!--          <el-select v-model="sendOutMode" placeholder="请选择物流发货方式" size="small">-->
      <!--            <el-option v-for="(item,index) in deliveryList" :key="index" :label="item.label"-->
      <!--                       :value="item.value"></el-option>-->
      <!--          </el-select>-->
      <!--        </el-form-item>-->
      <!--      </el-form>-->
      <el-form size="small" :model="form" :rules="rules" ref="formRef" label-width="120px">
        <el-form-item label="物流发货方式：" prop="isCainiao">
          <el-select v-model="form.isCainiao" placeholder="请选择物流发货方式" size="small">
            <el-option v-for="(item,index) in deliveryList" :key="index" :label="item.label"
                       :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="选择物流服务：" prop="logisticsService" v-if="form.isCainiao == '1' ">
          <el-select v-model="form.logisticsService" placeholder="请选择物流服务" size="small">
            <el-option v-for="(item,index) in dict.type.cainiao_logistics" :key="index" :label="item.label"
                       :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="国际物流单号：" prop="intlTrackingNo">
          <el-input v-model="form.intlTrackingNo" placeholder="请输入国际物流单号"/>
        </el-form-item>
        <el-form-item label="真实物流费用：" prop="realityLogisticsPrice">
          <el-input v-model="form.realityLogisticsPrice" placeholder="请输入真实物流费用"/>
        </el-form-item>
        <el-form-item label="货代费用：" prop="otherLogisticsPrice">
          <el-input v-model="form.otherLogisticsPrice" placeholder="请输入货代费用（没有填0）"/>
        </el-form-item>
        <el-form-item label="运费凭证：" prop="logisticsProof">
          <image-upload v-model="form.logisticsProof" :is-show-tip="false" width="50px" height="50px"/>
        </el-form-item>
        <el-form-item label="是否声明发货：" prop="type">
          <el-select v-model="form.type" placeholder="请选择是否声明发货" size="small">
            <el-option v-for="(item,index) in sendOutTypeList" :key="index" :label="item.label"
                       :value="item.value"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="close()">取 消</el-button>
        <el-button size="small" type="success" @click="confirm('1')">保存信息</el-button>
        <el-button size="small" type="primary" @click="confirm('2')">声明发货</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {
  cutOrderStorage,
} from "@/api/order/purchaser"
import {formatDate} from "@/utils";
import {queryOrderSendGoodsInfo, sellerShipmentForMyself, uploadSendInfo} from "@/api/order/orderApi";

export default {
  name: 'order-list',
  dicts: ['shipments_solution_type', 'cainiao_logistics'],
  props: {
    orderId: {
      type: String / Number
    },
    childOrderId: {
      type: String / Number
    },
  },
  data() {
    return {
      isOpen: true,
      form: {},//国内运单号信息
      rules: { // 线上发货表单校验
        intlTrackingNo: [{required: true, message: '国际物流单号不能为空', trigger: 'blur'}],
        realityLogisticsPrice: [{required: false, message: '真实物流费用不能为空', trigger: 'blur'}],
        otherLogisticsPrice: [{required: true, message: '货代费用不能为空', trigger: 'blur'}],
        logisticsProof: [{required: false, message: '请上传运费凭证', trigger: 'change'}],
        type: [{required: true, message: '请选择是否声明发货', trigger: 'change'}],
        isCainiao: [{required: true, message: '请选择物流发货方式', trigger: 'change'}],
        logisticsService: [{required: true, message: '请选择物流服务', trigger: 'change'}],
      },
      sendOutTypeList: [{label: "是", value: 1}, {label: "否", value: 0}],//发货类型列表
      sendOutMode: "",
      deliveryList: [{label: "菜鸟", value: 1}, {label: "非菜鸟", value: 0}]
    }
  },
  mounted() {
    this.getSendGoodsInfo()
  },
  methods: {
    // 获取已上传的凭证和运单号信息
    getSendGoodsInfo() {
      queryOrderSendGoodsInfo({orderId: this.orderId}).then(res => {
        this.form = res.data
      })
    },
    // 确定上传采购信息
    confirm(e) {
      this.$refs["formRef"].validate(valid => {
        if (valid) {
          if (e == '1') {//保存信息
            if (this.form.isCainiao == '0') {
              this.form.logisticsService = "OTHER"
            }
            this.form.orderId = this.orderId
            uploadSendInfo(this.form).then(res => {
              this.$message.success(res.msg)
              this.close('1')
            })
          } else {//声明发货
            this.form.orderId = this.orderId
            sellerShipmentForMyself(this.form).then(res => {
              this.$message.success(res.msg)
              this.close('1')
            })
          }
        }
      })
    },
    // 关闭线上发货弹窗
    close(isRefresh) {
      this.$emit('close', isRefresh)
    },
  }
}
</script>
<style scoped>
.el-divider__text {
  font-size: 16px;
  font-weight: bold;
  color: #000;
}
</style>
